<template>
  <div class="left-container">
    <h3>right组件</h3>
    <hr />
    <MyCount></MyCount>
    <hr />
    <h3>子向父传递</h3>
    <p>rightCount：{{ rightCount }}</p>
    <button @click="add">+1</button>
    <hr />
    <h3>兄弟组件之间的共享</h3>
    <p>{{ magFromLeft }}</p>
  </div>
</template>

<script>
import bus from "./eventBus.js";

export default {
  data() {
    return {
      rightCount: 0,
      magFromLeft: "",
    };
  },
  methods: {
    add() {
      this.rightCount += 1;
      this.$emit("numberChange", this.rightCount);
    },
  },
  created() {
    bus.$on("share", (val) => {
      this.magFromLeft = val;
      console.log("share被触发");
    });
  },
};
</script>

<style lang="less" scoped>
.left-container {
  background-color: orange;
  min-height: 250px;
  flex: 1;
}
</style>
